<template>
  <div>
    <template v-if="tlShow">
        <!-- 通联提现类型选择 -->
        <div class="withdrawalTypeBox_wrapper">
          <div class="withdrawalTypeBox_block">
            <h6>提现类型</h6>
            <div class="block_selmain">
              <div class="block_selmain_item" v-if="person == 0" @click="clickWithdrawalType(1)" :class="txType == 1 ? 'sel': ''">
                <i class="icon personal"></i>
                <p class="withdrawal_txt">
                  <span class="check"></span>
                  <span>个人提现</span>
                </p>
              </div>
              <div class="block_selmain_item" v-if="company == 0" @click="clickWithdrawalType(2)" :class="txType == 2 ? 'sel': ''">
                <i class="icon enterprise"></i>
                <p class="withdrawal_txt">
                  <span class="check"></span>
                  <span>企业提现</span>
                </p>
              </div>
            </div>
            <div class="block_btn" v-if="nextStep">
              <button class="block_btn_next" @click="checkTlfzRegister()">下一步</button>
            </div>
          </div>
        </div>
    </template>
    <hf-authentication v-if="hfShow" @close="closeHfAuthentication" :hfActive="hfActive" :hfType="hfType" />

  </div>
</template>
<script>
import hfAuthentication from '../components/hfAuthentication'
import { clickOpenAccount } from '@/api/user/fxs/fxsApi'
import { signContract } from '@/api/user/member/memberApi'

export default {
  components: {
    hfAuthentication
  },
  data() {
    return {
      hfShow: false,
      hfActive: 0, // 汇付分账步骤
      hfType: '1', // 汇付分账步骤类型
      // 通联
      tlShow: false,
      txType: 1,
      company: 0,
      person: 0,
      cashPopData: {},
      nextStep: false
    }

  },
  created() {
    if (this.$route.query.type == 1) {
      this.$loadingWrap.show()
      this.company = this.$route.query.company || 0
      this.person = this.$route.query.person || 0
      this.tlShow = true
      if (this.person == 1) {
        this.txType = 2
      }
      clickOpenAccount().then(res => {
        this.$loadingWrap.close()
        if (res.status == 1) {
          this.cashPopData = res.data.tlfz_info
          this.nextStep = true
        } else {
          this.$Error(res.msg)
        }
      })
    } else if (this.$route.query.type == 2) {
      this.hfShow = true
      this.hfActive = this.$route.query.hfActive
      this.hfType = this.$route.query.hfType
    }
  },
  methods: {
    jumpName(name, data) {
      this.$JumpName(this, name, data)
    },
    closeHfAuthentication() {
      wx.navigateBack({
        delta: 1
      })
    },
    clickWithdrawalType(type) {
      this.txType = type
      this.cashPopData.txType = type
    },
    checkTlfzRegister() {
      // console.log(this.txType, this.cashPopData.member_info.tlfz_have_person_signed, this.cashPopData.member_info.contract_status)
      if (this.txType == 1) { // 个人提现
        // 实名认证或绑定手机号未成功
        if (this.cashPopData.member_info.tlfz_have_person_signed != 1) {
          this.jumpName('tlQualification')
          return false
        } else if (this.cashPopData.member_info.contract_status != 1) {
          // 通联电子签约未签约,跳去通联签约
          signContract({ member_type: 3 }).then(res => {
            if (res.status == 1) {
              const tlfzUrl = res.data.jump_url
                // 跳转通商云平台账户的小程序
                wx.navigateToMiniProgram({
                  appId: 'wxc46c6d2eed27ca0a',//通商云平台账户小程序appId
                  path: 'pages/merchantAddress/merchantAddress',
                  extraData: {
                    targetUrl: tlfzUrl//商户拼接的请求报文
                  },
                  success(res) {
                    // 打开成功
                    // console.log(res)
                  },
                  fail(error) {
                    this.$Error('签约跳转失败')
                  }
                })
            } else {
              this.$Error(res.msg)
            }
          })
          return false
        } else {
          this.$Error('个人已开户')
        }
      } else { // 企业提现
        // this.setTlData(2)
        // return
        // this.jumpName('tlQualiConmpany')
        // openPage('tlQualiConmpany')
        // return
        const checkResult = this.cashPopData.company_member_info.check_result
        if (this.cashPopData.company_tlfz_need_register == 1) { // 企业提现
          this.jumpName('tlQualiConmpany')
          return false
        } else if (checkResult != 2) {
          // 认证结果：0认证中，1待审核，2成功，3失败
          if (checkResult == 0 || checkResult == 1) {
            this.$Error('审核中，请稍后重试')
            return false
          } else if (checkResult == 3) {
            this.$Error('审核失败，请重新签署')
            this.jumpName('tlQualiConmpany')
            return false
          }
        } else if (this.cashPopData.company_tlfz_need_bind_phone == 1) { // 绑定手机号
          this.jumpName('tlQualiBindPhone')
          return false
        } else if (this.cashPopData.company_member_info.ocr_idcard_comparison_result != 1 || this.cashPopData.company_member_info.ocr_regnum_comparison_result != 1) { // 影印件采集
          this.jumpName('tlQualiUpload', { idCard: this.cashPopData.company_member_info.ocr_idcard_comparison_result, comUp: this.cashPopData.company_member_info.ocr_regnum_comparison_result })
          return false
        } else if (this.cashPopData.company_member_info.contract_status != 1) {
          // 通联电子签约未签约,跳去通联签约
          signContract({ member_type: 2 }).then(res => {
            if (res.status == 1) {
              const tlfzUrl = res.data.jump_url
                // 跳转通商云平台账户的小程序
                wx.navigateToMiniProgram({
                  appId: 'wxc46c6d2eed27ca0a',//通商云平台账户小程序appId
                  path: 'pages/merchantAddress/merchantAddress',
                  extraData: {
                    targetUrl: tlfzUrl//商户拼接的请求报文
                  },
                  success(res) {
                    // 打开成功
                    // console.log(res)
                  },
                  fail(error) {
                    this.$Error('签约跳转失败')
                  }
                })
            } else {
              this.$Error(res.msg)
            }
          })
          return false
        } else {
          this.$Error('企业已开户')
        }
      }
    }
  }
  
}
</script>
<style lang="scss">
  // 提现类型弹层
  .withdrawalTypeBox_wrapper {
    // display: flex;
    // align-items: center;
    // justify-content: center;
    // position: fixed;
    // top: 0;
    // left: 0;
    // z-index: 100;
    // width: 100%;
    // height: 100%;
    // background: rgba(0, 0, 0, 0.5);
    .withdrawalTypeBox_block {
      position: relative;
      min-width: 600px;
      padding: 54px 70px;
      border-radius: 20px;
      background-color: #fff;
      h6{
        font-weight:bold;
        font-size:32px;
        color:#333;
        width: 100%;
        text-align: center;
        margin-bottom: 58px;
      }
      .block_selmain{
        display: flex;
        justify-content: space-around;
        margin-bottom: 60px;
        &_item{
          width:186px;
          height:186px;
          background-color:#F5F5F5;
          border: 1px solid #f5f5f5;
          border-radius:10px;
          margin-right: 54px;
          &:last-child{
            margin-right: 0;
          }
          i.icon{
            display: block;
            width: 65px;
            height: 65px;
            margin: 38px auto 18px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
            &.personal{
              background-image: url("https://img.wifenxiao.com/h5-wfx/images/user/typeIcon.png");
            }
            &.enterprise{
              background-image: url("https://img.wifenxiao.com/h5-wfx/images/user/typeIcon1.png");
            }
          }
          .withdrawal_txt{
            display: flex;
            justify-content: center;
            align-items: center;
            >span{
              display: inline-block;
              font-size: 26px;
              color: #666;
              height: 26px;
            }
            .check{
              position: relative;
              width: 26px;
              height: 26px;
              margin-right: 10px;
              border: 1px solid #b3b3b3;
              border-radius: 50%;
            }
          }
          &.sel{
            border-color: #F10A1D;
            background-color:#FFF7F7;
            i.icon{
              &.personal{
                background-image: url("https://img.wifenxiao.com/h5-wfx/images/user/typeIcon_sel.png");
              }
              &.enterprise{
                background-image: url("https://img.wifenxiao.com/h5-wfx/images/user/typeIcon1_sel.png");
              }
            }
            .withdrawal_txt{
              >span{
                color: #EF0919;
              }
              .check{
                border-color: transparent;
                &::after{
                  content: '';
                  position: absolute;
                  right: 0;
                  bottom: 0;
                  display: block;
                  width: 26px;
                  height: 26px;
                  background: url("https://img.wifenxiao.com/h5-wfx/images/user/icon_check.png") no-repeat center/contain;
                }
              }
            }
          }
        }
      }
      .block_btn_next{
        font-size: 28px;
        color: #fff;
        width: 100%;
        height: 86px;
        line-height: 86px;
        text-align: center;
        background: linear-gradient(to right,#FE1B49, #E90104);
        border-radius: 42px;
      }
    }
  }
</style>